<template>
  <div class="app-container">
    <h1>课程设计大作业管理系统</h1>
    <Introduction :intro="introData" />
    <TeamDivision :members="teamMembers" />
  </div>
</template>

<script setup>
import { reactive } from 'vue';
import Introduction from './components/Introduction.vue';
import TeamDivision from './components/TeamDivision.vue';

//功能简介
const introData = reactive({
  title:'项目简介',
  content:'项目介绍'
});
//成员数据
const teamMembers = reactive([
  {id:1,name: '蒋在',role: '组长', task: '后端设计'},
  {id:2,name: '杨这',role: '组员', task: '前端设计'},
  {id:3,name: '欧阳在',role: '组员', task: 'api设计'}
]);

</script>



<style scoped>
.app-container {
  max-width: 1000px;
  margin: 0 auto;
  padding: 20px;
  font-family: Arial, sans-serif;
}
h1 {
  color: #2c3e50;
  text-align: center;
  margin-bottom: 30px;
}
</style>